<script lang="jsx">
/**
 * @author lilinjie
 * @Description:
 */

import { defineComponent, onMounted } from 'vue'
import { useInjectData } from '@/context/user'

export default defineComponent({
  name: 'categoryModal',
  setup() {
    // 弹窗部分
    const {
      cuFilterForm,
      modelData,
      isEdit,
      onClickClose,
      onClickConfirm,
      onClickCreate,
      onClickEdit
    } = useInjectData()

    return () => {
      return (
          <div class="category-modal">
            <a-modal
                v-model:open={modelData.visible}
                onCancel={onClickClose}
                onOk={onClickConfirm}
            >
              <a-form
                  class="form"
                  disabled={modelData.isView}
                  style={{ marginTop: '20px' }}
                  label-col={{ span: 4 }}
                  wrapper-col={{ span: 19 }}
              >
                { modelData.isView &&
                    <a-form-item label="编号">
                      <a-input v-model:value={cuFilterForm.id} />
                    </a-form-item>
                }
                <a-form-item label="用户名">
                  <a-input v-model:value={cuFilterForm.username} />
                </a-form-item>
                <a-form-item label="昵称">
                  <a-input v-model:value={cuFilterForm.nickname} />
                </a-form-item>
                <a-form-item label="头像地址">
                  <a-input v-model:value={cuFilterForm.imgUrl} />
                </a-form-item>
                <a-form-item label="性别">
                  <a-input v-model:value={cuFilterForm.sex} />
                </a-form-item>
                <a-form-item label="亲密度">
                  <a-input v-model:value={cuFilterForm.intimacy} />
                </a-form-item>
              </a-form>
            </a-modal>
          </div>
      )
    }
  }
})
</script>

<style lang="less">
@import '@/assets/less/common-style.less';

.category-modal {

}
</style>
